<template>
  <div class="relative">
    <!-- <ParticleHeader /> -->
    <LazyFloorNavigation @navigate="navigateTo" @activeSectionChange="activeSectionChange" />
    <section id="swiper" class="relative overflow-hidden">
      <LazySwiperSection :slidesData="aData.web2_slider" class="relative" :floorSection="floorSection" />
      />
    </section>
    <section id="home">
      <LazyHeroSection :ciDdata="aData.web2_company_intro" />
    </section>
    <section id="about" class="py-20 bg-white">
      <LazyAboutSection :AboutUs="aData.web2_about_us" />
    </section>
    <section id="services" class="py-20 bg-gray-50">
      <LazyServicesSection :solutions="aData.web2_solutions" />
    </section>
    <section id="products" class="py-20 bg-white">
      <LazyProductsSection :products="aData.web2_products" />
    </section>
    <section id="news" class="py-20 bg-gray-50">
      <LazyNewsSection :news="aData.web2_news" />
    </section>
    <section id="contact" class="py-20 bg-indigo-700 text-white">
      <LazyContactSection />
    </section>
  </div>
</template>
<script setup lang="ts">
const { getAdminData, } = useAdminApi()
import { ref, onMounted } from 'vue'
import type { Database } from '~/types/page-admin'
// import HeroSection from '../components/sections/HeroSection.vue'
// import AboutSection from '../components/sections/AboutSection.vue'
// import ServicesSection from '../components/sections/ServicesSection.vue'
// import ProductsSection from '../components/sections/ProductsSection.vue'
// import NewsSection from '../components/sections/NewsSection.vue'
// import ContactSection from '../components/sections/ContactSection.vue'
// import FloorNavigation from '../components/FloorNavigation.vue'
// import ParticleHeader from '../components/ParticleHeader.vue'
// 使用useHead来设置页面的SEO信息
useSeo({
  title: '首页 - 创新驱动未来',
  description: '数字化解决方案, 企业服务, 创新科技',
  keywords: '数字化, 企业服务, 创新科技, 产品服务, 联系我们',
  image: 'https://www.example.com/logo.png',
})

definePageMeta({
  layout: 'home',
  showHeader: true
});


const navigateTo = (id: string) => {
  const element = document.getElementById(id)
  if (element) {
    element.scrollIntoView({ behavior: 'smooth' })
  }
}
const floorSection = ref('swiper')
const aData = ref(<Database>{})

const activeSectionChange = (sectionId: string) => {
  // 处理活动部分变化的逻辑
  floorSection.value = sectionId
}

// 初始化数据
onMounted(async () => {
  aData.value = await getAdminData()
})

</script>
